extends layout

block content
  block style
    link(rel="stylesheet" media="all" href="./vendor/mocha.css")

    style.
      #demo { display: none; }

      #mocha-stats {
        top: 70px;
      }

      @media (max-width:60em) {
        #mocha-stats {
          position: static;
        }
        body {
          padding: 10px 20px;
        }
      }

  main.test
    section
      h1 Tests for Umbrella JS

      div#mocha
      div#messages
      div#fixtures

      div#demo.demo
        div#base.base
          ul
            li
              a#world.hello.world Hello world
            li
              a Hello world
            li
              a Hello world
          form.login(method="POST" action="/test")
            input(name="name" value="John")
            input(name="email" required)
            input
            input(name="other" type="checkbox")
            input(type="submit" value="Send!")

          form.clone
            input(type="text")
            input(type="checkbox")
            input(type="radio")
            select(name="options")
              option(value="a" selected) A
              option(value="b") B
              option(value="c") C
            textarea
          div.destination


          p Lorem <em>ipsum</em>

        table.performance
          tr
            th Test 1
            th Test 2
            th Test 3
            th Test 4

        table.tbl


  script(src="./vendor/mocha.js")
  script(src="./vendor/chai.js")
  script(src="./vendor/sinon.js")
  script(src="./vendor/jquery.js")
  script(src="./vendor/polyfill.js")
  script(src="./umbrella.min.js")
  script.
    mocha.setup('bdd');
    var base = u("#base");
  script(src="./test.js")
  script.
    if (window.mochaPhantomJS) { mochaPhantomJS.run(); }
    else { mocha.run(); }
